<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2022/12/10
  Time: 10:48
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="utf-8" %>
<% request.setAttribute("ctx", request.getContextPath()); %>
<html>
<head>
    <title>客户关系管理系统</title>
    <meta charset="UTF-8">
    <link rel="shortcut icon" type="image/x-icon" href="${ctx}/static/favicon.ico">
    <link rel="stylesheet" type="text/css"
          href="${ctx}/static/css/materialdesignicons.min.css">
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css"
          href="${ctx}/static/js/bootstrap-multitabs/multitabs.min.css">
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/style.min.css">
    <link href="${ctx}/static/js/jquery-confirm/jquery-confirm.min.css" rel="stylesheet">
</head>
<body>
<div class="lyear-layout-web">
    <div class="lyear-layout-container">
        <!--左侧导航-->
        <aside class="lyear-layout-sidebar">
            <!-- logo -->
            <div id="logo" class="sidebar-header">
                <p></p>
                <a href="${ctx}/page/index">
                    <span class="text-warning h3">C</span>
                    <span class="text-success h3">R</span>
                    <span class="text-purple h3">M</span>
                    <span class="text-danger h3">S</span>
                </a>
                <p></p>
            </div>
            <div class="lyear-layout-sidebar-info lyear-scroll">
                <nav class="sidebar-main">
                    <ul class="nav-drawer" id="menu">
                        <li class="nav-item active">
                            <a class="multitabs" href="${ctx}/page/home">
                                <i class="mdi mdi-home"></i>
                                <span>首页</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
        </aside>
        <!--End 左侧导航-->

        <!--头部信息-->
        <header class="lyear-layout-header">
            <nav class="navbar">
                <div class="navbar-left">
                    <div class="lyear-aside-toggler">
                        <span class="lyear-toggler-bar"></span>
                        <span class="lyear-toggler-bar"></span>
                        <span class="lyear-toggler-bar"></span>
                    </div>
                </div>
                <ul class="navbar-right d-flex align-items-center">
                    <li>
                        <a href="javascript:void(0)">
                            <span id="date"></span>
                        </a>
                    </li>
                    <li class="dropdown dropdown-notice">
								<span data-toggle="dropdown" class="icon-item">
									<i class="mdi mdi-bell-outline" style="color: white;"></i>
									<span class="badge badge-danger">1</span>
								</span>
                        <div class="dropdown-menu dropdown-menu-right">
                            <div class="lyear-notifications">
                                <div class="lyear-notifications-title clearfix" data-stopPropagation="true"><a
                                        href="#" class="float-right">查看全部</a>你有1条未读消息
                                </div>
                                <div class="lyear-notifications-info lyear-scroll">
                                    <a href="#" class="dropdown-item"
                                       title="树莓派销量猛增，疫情期间居家工作学习、医疗领域都需要它">树莓派销量猛增，疫情期间居家工作学习、医疗领域都需要它</a>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="dropdown dropdown-profile">
                        <a href="javascript:void(0)" data-toggle="dropdown" class="dropdown-toggle">
                            <img class="img-avatar img-avatar-48 m-r-10" id="title_img"
                                 src="${ctx}/static/images/users/${sessionScope.session_user.userImg}"
                                 alt="${sessionScope.session_user.username}"/>
                            <span id="user_name">${sessionScope.session_user.username}</span>
                        </a>
                        <ul class="dropdown-menu dropdown-menu-right">
                            <li>
                                <a class="multitabs dropdown-item"
                                   data-url="${ctx}/page/update-profile"
                                   href="javascript:void(0)">
                                    <i class="mdi mdi-account">&nbsp;</i> 个人信息</a>
                            </li>
                            <li>
                                <a class="multitabs dropdown-item"
                                   data-url="${ctx}/page/update-password"
                                   href="javascript:void(0)"><i class="mdi mdi-lock-outline">&nbsp;</i> 修改密码</a>
                            </li>
                            <li>
                                <a class="dropdown-item" href="javascript:void(0)" id="clear"><i
                                        class="mdi mdi-delete">&nbsp;</i> 清空缓存</a>
                            </li>
                            <li class="dropdown-divider"></li>
                            <li>
                                <a class="dropdown-item" href="javascript:void(0)" id="out"><i
                                        class="mdi mdi-logout-variant">&nbsp;</i> 退出登录</a>
                            </li>
                        </ul>
                    </li>
                </ul>
            </nav>
        </header>
        <!--End 头部信息-->

        <!--页面主要内容-->
        <main class="lyear-layout-content">
            <div id="iframe-content"></div>
        </main>
        <!--End 页面主要内容-->
    </div>
</div>

<script type="text/javascript" src="${ctx}/static/js/jquery.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/popper.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/perfect-scrollbar.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/bootstrap-multitabs/multitabs.min.js"></script>
<script src="${ctx}/static/js/bootstrap-notify.min.js" type="text/javascript"></script>
<script type="text/javascript" src="${ctx}/static/js/jquery.cookie.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/jquery-confirm/jquery-confirm.min.js"></script>
<script type="text/javascript">
    $(document).ready(function (e) {
    });
    $(function () {
        // 登录消息
        if ("${per}" !== '') {
            notify("mdi mdi-close", "${per}", "danger");
        }

        // 选项卡
        $('#iframe-content').multitabs({
            iframe: true,
            refresh: 'all',  // iframe中页面是否刷新，'no'：'从不刷新'，'nav'：'点击菜单刷新'，'all'：'菜单和tab点击都刷新'
            nav: {
                backgroundColor: '#ffffff',
            },
            init: [{
                type: 'main',
                title: '首页',
                url: '${ctx}/page/home'
            }]
        });

        // 菜单显示
        $.get("${ctx}/module/findMenu", "", function (data) {
            $(data).each(function (i, obj) {
                var menuHtml = '<li class="nav-item nav-item-has-subnav">' +
                    '<a href="javascript:void(0)"><i class="mdi ' + obj.menuIcon + '"></i> <span>' + obj.menuName + '</span></a>' +
                    '<ul class="nav nav-subnav">';

                $(obj.children).each(function (j, child) {
                    menuHtml += '<li> <a class="multitabs" href="${ctx}/' + child.menuUrl + '"><i class="mdi ' + child.menuIcon + '">&nbsp;</i>' + child.menuName + '</a> </li>';
                });

                menuHtml += '</ul></li>';
                $("#menu").append(menuHtml);
            });
        });


        // 清除缓存
        $("#clear").click(function () {
            $.confirm({
                title: '清除缓存',      // 标题
                content: '你确定要清除缓存吗？',    // 内容
                type: 'red',        // 类型颜色
                icon: 'mdi mdi-close', // 小图标
                typeAnimated: true, // 是否使用动画
                buttons: {          // 按钮
                    confirm: {      // 确认按钮
                        text: '确认',
                        btnClass: 'btn-red',
                        action: function () {
                            window.location.replace("index");
                        }
                    },
                    cancel: {   // 取消按钮
                        text: '取消',
                        action: function () {
                        }
                    }
                }
            });
        });

        // 退出登录
        $("#out").click(function () {
            $.confirm({
                title: '退出',      // 标题
                content: '你确定要退出登录吗？',    // 内容
                type: 'red',        // 类型颜色
                icon: 'mdi mdi-keyboard-backspace', // 小图标
                typeAnimated: true, // 是否使用动画
                buttons: {          // 按钮
                    confirm: {      // 确认按钮
                        text: '确认',
                        btnClass: 'btn-red',
                        action: function () {
                            // 加载中使用文字和颜色
                            let l = $('body').lyearloading({
                                opacity: 0.125,
                                spinnerSize: 'lg',
                                spinnerText: '正在退出中，.请稍后..',
                                textColorClass: 'text-danger'
                            });
                            setTimeout(function () {
                                window.parent.location.href = "${ctx}/logout";
                                l.destroy();
                            }, 2e3);
                        }
                    },
                    cancel: {   // 取消按钮
                        text: '取消',
                        action: function () {
                        }
                    }
                }
            });
        });

        // 显示时间
        showTime();
    });


    // 消息弹框
    function notify(icon, msg, type) {
        $.notify({
            icon: icon,
            message: msg
        }, {
            element: 'body',
            type: type,
            placement: {
                from: 'top',
                align: 'center'
            },
            delay: 3000
        });
    }

    var u = '<%=session.getMaxInactiveInterval()%>'

    function showTime() {
        let date = new Date();
        let year = date.getFullYear();
        let month = date.getMonth() + 1;  //因为month属性从0开始所以加1
        let day = date.getDate();   // 日
        let week = date.getDay();  // 星期几，是个数字
        // 星期格式化
        if (week === 0) {
            week = "星期天";
        } else if (week === 1) {
            week = "星期一";
        } else if (week === 2) {
            week = "星期二";
        } else if (week === 3) {
            week = "星期三";
        } else if (week === 4) {
            week = "星期四";
        } else if (week === 5) {
            week = "星期五";
        } else if (week === 6) {
            week = "星期六";
        }
        let hour = date.getHours();
        let minute = date.getMinutes();
        let second = date.getSeconds();
        //补齐个数
        month = (month >= 10) ? month : '0' + month;
        day = (day >= 10) ? day : '0' + day;
        hour = (hour >= 10) ? hour : '0' + hour;
        minute = (minute >= 10) ? minute : '0' + minute;
        second = (second >= 10) ? second : '0' + second;
        $("#date").html("今天是：" + year + "年&nbsp;" + month + "月&nbsp;" + day + "日&nbsp;&nbsp;" + week + " &nbsp;" + hour + ":" + minute + ":" + second);

        u--;

        if (u === 0) {
            notify("mdi mdi-close", "登陆失效，请重新登陆！", "danger");
        }

        if (u === -3) {
            window.location.href = "${ctx}/page/login";
        }
    }

    setInterval("showTime()", 1000);//每隔1000毫秒（即1秒）显示一次当前时间
</script>
<script type="text/javascript" src="${ctx}/static/js/lyear-loading.js"></script>
<script type="text/javascript" src="${ctx}/static/js/index.min.js"></script>
</body>
</html>
